// pages/CustomizeCmpt/DataObservers/data-observers.js
Component({
  data: {
    string: '111',
    object: {username:'syx', password: '88888888'},
    array: [1, 2, 3]
  },
  methods: {
    inputUsername(event) {
      this.setData({'object.username': event.detail.value})
    },
    inputPassword(event) {
      this.setData({'object.password': event.detail.value})
    },
    updateObjAll() {
      this.setData({object: this.data.object})
    },
    inputArrItem(event) {
      const index = event.currentTarget.dataset.index;
      const key = `array[${index}]`;
      this.setData({[key]: event.detail.value})
    },
    updateArrAll() {
      this.data.array.push(this.data.array.length+1)
      this.setData({array: this.data.array})
    }
  },
  observers: {
    // 监听单个属性properties或数据data
    string: function(newVal) { 
      console.log('Single', newVal)
    },
    // 监听多个属性properties或数据data
    'string, object.username': function(newVal1, newVal2) { 
      console.log('Multiple', newVal1, newVal2)
    },
    // 监听某个object类型属性值
    'object.password': function(newVal) {
      console.log('ObjOne', newVal)
    },
    // 监听整个object类型
    object: function(newVal) {
      console.log('ObjAll', newVal)
    },
    // 监听某个array类型元素值
    'array[0]': function(newVal) {
      console.log('ArrOne', newVal)
    },
    // 监听整个array类型
    'array': function(newVal) {
      console.log('ArrMul', newVal)
    },
    // **每次setData都被触发
    '**': function(newVal) {
      console.log('**', newVal)
    },
  }
})
